﻿@model HomeViewModel
@{
    ViewBag.Title = "Home Page";
    var session = Model.Session;
    var userName = session.UserName ?? session.Email ?? "test";
}

@section scripts {
    <script src="/js/ss-utils.js"></script>
    <script src="/js/autogrid.js"></script>

    <script type="text/javascript">
    var hashVars = $.ss.queryString(location.hash.replace('#','?'));
    if (hashVars['f']) {
        $("#autherror").html($.ss.humanize(hashVars['f']));
    }

    $.getJSON("/auth", function (r) {
        var html = "<h4 class='success'>Authenticated!</h4>"
            + "<table>"
            + $.map(r, function(k, v) {
                return "<tr><th>" + v + "<th>"
                    + "<td>" + (typeof k == 'string' ? k : JSON.stringify(k)) + "</td></tr>";
            }).join('')
            + "</table>";
        $("#status").html(html);
    }).error(function () {
        $("#status").html("<h4 class='error'>Not Authenticated</h4>");
    });

    $(document).bindHandlers({
       switchUser: function(u) {
           $("#userName").val(u);
           $("#password").val('test');
       }
    });

    $("#form-register").bindForm({
        success: function (r) { location.href = '/'; }
    });

    var html = autogrid( @(Model.UserAuths.AsRawJson()) );
    $("#userauths").html(html);
    html = autogrid( @(Model.UserAuthDetails.AsRawJson()) );
    $("#userauthdetails").html(html);
    </script>
}

<div class="jumbotron">
    <h1>ASP.NET MVC with ServiceStack</h1>
    <p class="lead">
        Make use of ServiceStack's clean, high-performance, testable components integrated within MVC:
        <ul>
            <li>Simple, declarative <a href="https://github.com/ServiceStack/ServiceStack/wiki/Authentication-and-authorization">Multi-Authentication Provider model</a></li>
            <li>Distributed and In-Memory <a href="https://github.com/ServiceStack/ServiceStack/wiki/Caching">Caching Providers</a></li>
            <li>Typed and dynamic <a href="https://github.com/ServiceStack/ServiceStack/wiki/Sessions">Sessions</a></li>
            <li>Clean, Flexible, Modifyable <a href="https://github.com/ServiceStack/ServiceStack/wiki/AppSettings">AppSettings Config</a></li>
            <li><a href="https://github.com/ServiceStack/ServiceStack.OrmLite">OrmLite</a> - Fast, Simple, Typed ORM</li>
            <li><a href="https://github.com/ServiceStack/ServiceStack.Redis">ServiceStack.Redis</a> - Full-featured Redis Client</li>
            <li>Offload tasks to <a href="https://github.com/ServiceStack/ServiceStack/wiki/Messaging">Redis or RabbitMQ MQ Servers</a></li>
        </ul>
    </p>
</div>

<div class="row">
    <div class="col-lg-6">

        @if (session.IsAuthenticated)
        {
            <h2 class="success">Authenticated!</h2>
        }
        else
        {
            <h2 class="error">Not Authenticated</h2>
        }
        <div id="autherror" class="error"></div>

        <form action="/Home/Login">
            @Html.ValidationSummary()
            <input type="hidden" name="redirect" value="@Html.GetQueryString("redirect")" />

            <div class="form-group">
                <input class="form-control input-lg" id="userName" name="userName" type="text" placeholder="UserName" value="@userName">
            </div>
            <div class="form-group form-inline">
                <input class="form-control input-lg" id="password" name="password" type="text" placeholder="Password" value="test">
                <button type="submit" class="btn btn-lg btn-default">Login</button>
            </div>
            <div style="margin:10px">
                <b>Quick Login:</b>
                <span data-click="switchUser:test">test</span>,
                <span data-click="switchUser:test2">test2</span>,
                <span data-click="switchUser:new.user@@gmail.com">new.user</span>
            </div>
        </form>

        <form action="/Home/Logout">
            <button type="submit" class="btn btn-default">Logout</button>
        </form>

    </div>
    <div class="col-lg-6">

        <h2 style="margin: 30px 0 0 0;">ServiceStack Status (Ajax)</h2>
        <div id="status"></div>

        <table class="table table-striped" style="margin: 20px 0 0 0">
            <tr>
                <th colspan="2">ServiceStack Auth &amp; Session Links:</th>
            </tr>
            <tr>
                <th>View Session Info</th>
                <td><a href="/session">/session</a></td>
            </tr>
            <tr>
                <th>Edit Session Info</th>
                <td><a href="/session/edit/ANYTEXT">/session/edit/ANYTEXT</a></td>
            </tr>
            <tr>
                <th>AuthOnly Page</th>
                <td><a href="/AuthOnly">/AuthOnly</a></td>
            </tr>
            <tr>
                <th>Requires Role Page</th>
                <td><a href="/RequiresRole">/RequiresRole</a></td>
            </tr>
            <tr>
                <th>Reset All User Info</th>
                <td><a href="/reset">/reset</a></td>
            </tr>
        </table>
    </div>
</div>
<hr />
<div class="row">
    <div class="col-lg-6">
        <h3>Sign in with 3rd Party Providers</h3>
        <div style="float: left; width: 250px; padding: 0 0 0 0;">
            <a class="btn btn-block btn-social btn-twitter" href="/auth/twitter">
                <b class="fa fa-twitter">T</b>Sign in with Twitter
            </a>
            <a class="btn btn-block btn-social btn-facebook" href="/auth/facebook">
                <b class="fa fa-facebook">fb</b>Sign in with Facebook
            </a>
            <a class="btn btn-block btn-social btn-github" href="/auth/github">
                <b class="fa fa-github"></b>Sign in with GitHub
            </a>
            <a class="btn btn-block btn-social btn-vk" href="/auth/vkcom">
                <b class="fa fa-vk"></b>Sign in with VK
            </a>
            <a class="btn btn-block btn-social btn-yandex" href="/auth/Yandex">
                <b class="fa fa-yandex">Y</b>Sign in with <b>Y</b>andex
            </a>
        </div>
    </div>
    <div class="col-lg-6">
        <h3>Register New User</h3>
        <form id="form-register" action="/register" method="POST">
            <div class="form-group">
                <input class="form-control input-lg" type="text" name="FirstName" value="New" placeholder="First Name">
                <span class="help-block"></span>
            </div>
            <div class="form-group">
                <input class="form-control input-lg" type="text" name="LastName" value="User" placeholder="Last Name">
                <span class="help-block"></span>
            </div>
            <div class="form-group">
                <input class="form-control input-lg" type="text" name="Email" value="new.user@gmail.com" placeholder="Email">
                <span class="help-block"></span>
            </div>
            <div class="form-group">
                <input class="form-control input-lg" type="text" name="Password" value="test" placeholder="Password">
                <span class="help-block"></span>
            </div>
            <div class="form-group">
                <input type="checkbox" id="chkAutoLogin" name="AutoLogin" value="true" checked="checked">
                <label for="chkAutoLogin">Auto Login</label>
            </div>
            <div class="form-group">
                <button class="btn btn-lg btn-default" type="submit">Register</button>
            </div>
            <div class="clearfix"></div>
        </form>
    </div>
</div>

@section footer {
    <div style="padding: 10px">
        @if (!Model.UserAuths.IsEmpty())
        {
            <h3>User Auths</h3>
            <div class="autogrid" id="userauths"></div>
        }

        @if (!Model.UserAuthDetails.IsEmpty())
        {
            <h3>User Auth Details</h3>
            <div class="autogrid" id="userauthdetails"></div>
        }
    </div>

    <a href="https://github.com/ServiceStack/Test/tree/master/src/Mvc">
        <img style="position:absolute;top:0;right:0;border:0;z-index:1031"
             src="https://s3.amazonaws.com/github/ribbons/forkme_right_darkblue_121621.png"
             alt="Fork me on GitHub">
    </a>
}